<style type="text/css">
    .qwe{
       background-color: #fafbfc;
    }
    .rty{
        background-color: #ffffff;
    }
    .header{
        text-align:center; 
        border-left:1px solid #eaeff0; 
        border-top:1px solid #eaeff0;
        border-bottom:1px solid #eaeff0;  
        padding: 8px 0px;
        background-color: #ffffff;
        color: #58666e
    }
    .content_style{
        text-align:center; 
        border-left:1px solid #eaeff0;
        border-bottom:1px solid #eaeff0;
    }
    .pad5{
        padding: 5px 15px;
    }
</style>

  
<div class="col-sm-12 mt20" ng-keyup="myKeyup($event)">
<div class="panel panel-default">
<div class="panel-body">
<div class="col-sm-12">

    <div class="row ">
        <div class="col-sm-2">
            <input type="text" class="form-control"  ng-model="order_code" placeholder="订单编号"> 
        </div>
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="product_id" placeholder="产品ID">
        </div>
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="mobile" placeholder="联系电话">
        </div>
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="product_name" placeholder="产品名称">
        </div>
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="name" placeholder="联系人">
        </div>
        <div class="col-sm-2">
            <ui-select ng-model="d.upplier_check_state" theme="bootstrap" >
                <ui-select-match placeholder="供应商确认状态">
                    {{$select.selected.name}}
                </ui-select-match>
                <ui-select-choices repeat="item.value as item in ucsarr | filter: $select.search">
                    <span ng-bind-html="item.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
        
       
        </div>

        <div class="row mt10"> 
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="tour_date" placeholder="出游日期"> 
        </div>
    
        <div class="col-sm-2">
            <input type="text" class="form-control" ng-model="supplier_product_name" placeholder="供应商产品名称"> 
        </div>
         <div class="col-sm-2">
            <ui-select ng-model="d.pay_state" theme="bootstrap" >
                <ui-select-match placeholder="支付类型">
                    {{$select.selected.name}}
                </ui-select-match>
                <ui-select-choices repeat="item.value as item in psarr | filter: $select.search">
                    <span ng-bind-html="item.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>

        
        <div class="col-sm-2 col-sm-offset-2 pull-right">
            <button class="btn btn-block btn-info" ng-click="search()">搜索</button> 
        </div>

    </div>

</div>
</div>
</div>
<!-- searchArea -->

<div class="panel panel-default">
    <div class="panel-body">
        <div style="margin: 0px">

        <div class="col-sm-12" style="display: table; width: 100%;table-layout:fixed;padding: 0px">
            <div class="pull-left header" style="height: 40px; width: 17%"><b>订单号</b></div>
            <div class="pull-left header" style="height: 40px; width: 18%"><b>供应商产品名称</b></div>
            <div class="pull-left header" style="height: 40px; width: 15%"><b>产品编号</b></div>    
            <div class="pull-left header" style="height: 40px; width: 10%"><b>出游日期</b></div>
            <div class="pull-left header" style="height: 40px; width: 10%"><b>联系人姓名</b></div>
            <div class="pull-left header" style="height: 40px; width: 10%"><b>联系电话</b></div>
            <div class="pull-left header" style="height: 40px; width: 10%"><b>供应商确认状态</b></div>       
            <div class="pull-left header" style="height: 40px; width: 10%;border-right:1px solid #eaeff0"><b>支付状态</b></div>
        </div>
        <div class="col-sm-12" ng-repeat="item in a " style="display: table; width: 100%;table-layout:fixed;padding: 0px">
    
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 17%; padding: 8px 0px">{{item.order_code}}</div>
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 18%; padding: 8px 10px ;max-width:100%;display:block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;" title="{{item.supplier_product_name}}">{{item.supplier_product_name}}</div>
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 15%; padding: 8px 0px">{{item.product_id}}</div>
            
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 10%; padding: 8px 0px">{{item.tour_date}}</div>
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 10%; padding: 8px 0px">{{item.name}}</div>
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 10%; padding: 8px 0px">{{item.mobile}}</div>
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 10% ;padding: 8px 0px">{{item.upplier_check_state_name}}</div>
            
            <div ng-click="show($index)" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="pull-left content_style" style="height: 40px; width: 10%; padding: 8px 0px">{{item.pay_state_name}}</div>

            <div ng-show="b==1&&c==$index" ng-class="{true:'qwe', false:'rty'}[$index%2 == 0]" class="col-sm-12" style="border-left:1px solid #eaeff0; border-right:1px solid #eaeff0; border-bottom:1px solid #eaeff0;padding: 10px 5px">
                <div class="pull-left col-sm-3 pad5" >
                    产品名称：{{item.product_name}}
                </div>
                <div class="pull-left col-sm-3 pad5" >
                    产品类型：{{item.product_type_name}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    出发城市：{{item.start_city_arr}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    出游人数：{{item.people_num}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    成人数：{{item.adult_number}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    成人价格：{{item.adult_sale_price}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    儿童数：{{item.children_number}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    儿童价格：{{item.children_sale_price}}
                </div>
                <div class="pull-left col-sm-3 pad5">
                    订单时间：{{item.create_time}}
                </div>
            </div>
        </div>
    </div>
        <div class="text-right" >
             <pagination 
    style="margin-top: 30px"
        total-items="totalItems" 
        ng-model="currentPage" 

        ng-change="aaa()"
        previous-text="上一页"
        next-text="下一页"
        first-text="首页"
        last-text="尾页"
        max-size="5"
        boundary-links="true"
        rotate="false"

        items-per-page="itemsPerPage"
        class=" m-b"></pagination>
        </div>
    </div>
</div>

</div>